﻿
@{
    ViewData["Title"] = "Products";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Demo</title>
    <script src="~/libs/jquery/jquery.js"></script>
    <link href="~/layui-v2.9.16/layui/css/layui.css" rel="stylesheet" />
    <script src="~/layui-v2.9.16/layui/layui.js"></script>

</head>
<body>

    <p border></p>

    <table class="layui-hide" lay-filter="test" id="ID-table-demo-page"></table>
    <br />

    <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">
          <button  class="layui-btn layui-btn-sm4 layui-bg-red" lay-event="demoAdd">选择数据</button>
          </div>
    </script>

    <script type="text/html" id="toolDemo">
        <div class="layui-clear-space">
          <a class="layui-btn layui-btn-xs" lay-event="del">删除</a>
        </div>
    </script>

    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script>
        layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider'], function () {
            var form = layui.form;
            var layer = layui.layer;
            var laydate = layui.laydate;
            var util = layui.util;
            var layer = layui.layer;
            var util = layui.util;
            var table = layui.table;
            var laypage = layui.laypage;

            var ids = [];


            //显示
            function GetWorkShop() {

                // 创建渲染实例
                table.render({
                    elem: '#ID-table-demo-page',
                    toolbar: '#toolbarDemo',
                    url: '/SalesController1/GetProducts', // 此处为静态模拟数据，实际使用时需换成真实接口
                    cols: [[
                        { type: 'checkbox', fixed: 'left' },
                        { field: 'productName', width: 150, title: '产品名称', sort: true },
                        { field: 'productCode', width: 150, title: '产品编码' },
                        { field: 'productSpecification', width: 150, title: '规则', sort: true },
                        { field: 'unit', width: 150, title: '单位', sort: true },
                        { field: 'unitPrice', width: 150, title: '单价', sort: true },
                        { field: 'right', width: 180, title: '操作', templet: '#toolDemo' }
                    ]],


                    parseData: function (res) {
                        return {
                            "code": 0, //解析接口状态
                            "data": res//解析数据列表
                        };
                    },
                });

            }



            GetWorkShop();

            var ProductCodes = "";

            // 工具栏事件
            table.on('toolbar(test)', function (obj) {
                var id = obj.config.id;
                var checkStatus = table.checkStatus(id);
                var othis = lay(this);

                // console.log(checkStatus)
                if (checkStatus.data.length == 0) {
                    layer.msg("请选择数据")

                }
                else {
                    switch (obj.event) {
                        case 'demoAdd':
                            var data = checkStatus.data;
                            // console.log(data)
                            localStorage.setItem("productList",JSON.stringify(data))
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                            break;

                    };
                }

            });


        });
    </script>

</body>
</html>



